<!-- Copyright 2019 The Chromium Authors. All rights reserved.
     Use of this source code is governed by a BSD-style license that can be
     found in the LICENSE file. -->

<link rel="import" href="chrome://resources/html/polymer.html">

<link rel="import" href="chrome://resources/html/action_link.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">

<link rel="import" href="../../components/oobe_icons.html">
<link rel="import" href="../../components/behaviors/login_screen_behavior.html">
<link rel="import" href="../../components/behaviors/multi_step_behavior.html">
<link rel="import" href="../../components/behaviors/oobe_i18n_behavior.html">
<link rel="import" href="../../components/buttons/oobe_text_button.html">
<link rel="import" href="../../components/common_styles/common_styles.html">
<link rel="import" href="../../components/common_styles/oobe_dialog_host_styles.html">
<link rel="import" href="../../components/dialogs/oobe_adaptive_dialog.html">

<dom-module id="adb-sideloading-element">
  <template>
    <style include="oobe-dialog-host-styles"></style>

    <!-- Dialog for normal confirmation -->
    <oobe-adaptive-dialog id="enableAdbSideloadDialog" role="dialog"
        for-step="setup" footer-shrinkable
        aria-label$="[[i18nDynamic(locale, 'enableAdbSideloadingSetupTitle')]]">
      <iron-icon slot="icon" icon="oobe-32:alert"></iron-icon>
      <h1 slot="title">
        [[i18nDynamic(locale, 'enableAdbSideloadingSetupTitle')]]
      </h1>
      <p slot="subtitle">
        [[i18nDynamic(locale, 'enableAdbSideloadingSetupMessage')]]
        <a on-click="onLearnMoreTap_" class="oobe-local-link"
            is="action-link">
          [[i18nDynamic(locale, 'enableAdbSideloadingLearnMore')]]
        </a>
      </p>
      <div slot="content" class="flex layout vertical center center-justified">
        <img srcset="images/arc_sideloading_illustration.svg"
            class="oobe-illustration">
      </div>
      <div slot="bottom-buttons">
        <oobe-text-button border on-click="onCancelTap_"
            text-key="enableAdbSideloadingCancelButton"
            id="enable-adb-sideloading-cancel-button"></oobe-text-button>
        <oobe-text-button inverse on-click="onEnableTap_" class="focus-on-show"
            text-key="enableAdbSideloadingConfirmButton"
            id="enable-adb-sideloading-ok-button"></oobe-text-button>
      </div>
    </oobe-adaptive-dialog>

    <!-- Dialog for error -->
    <oobe-adaptive-dialog id="enableAdbSideloadErrorDialog" role="dialog"
        for-step="error" footer-shrinkable
        aria-label$="[[i18nDynamic(locale, 'enableAdbSideloadingSetupTitle')]]">
      <iron-icon slot="icon" icon="oobe-32:warning"></iron-icon>
      <h1 slot="title">
        [[i18nDynamic(locale, 'enableAdbSideloadingErrorTitle')]]
      </h1>
      <p slot="subtitle">
        [[i18nDynamic(locale, 'enableAdbSideloadingErrorMessage')]]
        <a on-click="onLearnMoreTap_" class="oobe-local-link" is="action-link">
          [[i18nDynamic(locale, 'enableAdbSideloadingLearnMore')]]
        </a>
      </p>
      <div slot="content" class="flex layout vertical center center-justified">
        <img src="images/error.svg" class="oobe-illustration">
      </div>
      <div slot="bottom-buttons">
        <oobe-text-button inverse on-click="onCancelTap_" class="focus-on-show"
            text-key="enableAdbSideloadingOkButton"></oobe-text-button>
      </div>
    </oobe-adaptive-dialog>
  </template>
  <script src="adb_sideloading.js"></script>
</dom-module>